<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html >
<html>
    <head>
        <title>SL商城-修改密码</title>
		<meta charset='utf-8'>
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=no">
		<!-- 引入 Bootstrap -->
			<link href="${pageContext.request.contextPath }/css/bootstrap.min.css" rel="stylesheet">
 
		<!-- HTML5 Shim 和 Respond.js 用于让 IE8 支持 HTML5元素和媒体查询 -->
		<!-- 注意： 如果通过 file://  引入 Respond.js 文件，则该文件无法起效果 -->
		<!--[if lt IE 9]>
			<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
			<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
		<![endif]-->
		<!-- jQuery (Bootstrap 的 JavaScript 插件需要引入 jQuery) -->
		<script src="${pageContext.request.contextPath }/js/jquery.js"></script>
		<!-- 包括所有已编译的插件 -->
		<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
    </head>
	
	<style>
		#pwdc{
			width:600px;
			margin-left:50px;
		}
		
		
	</style>
	
	<body>
		<!-- 
			一个经典的模态框 
			使其显示,$("#id").modal('show')
			使其隐藏,$("#id").modal('hide')
		-->
		<div class="modal fade" id="tip" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-dialog">
				<div class="modal-content">
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="myModalLabel">提示</h4>
					</div>
					<div id='infoText' class="modal-body">
						
					</div>
					<div class="modal-footer">
						<button type="button" class="btn btn-primary" data-dismiss="modal">确定</button>
					</div>
				</div><!-- /.modal-content -->
			</div><!-- /.modal -->
		</div>
	
		<div id="pwdc">
			<form onsubmit="return changePwd('pwd')" class="form form-horizontal" id="pwd" method="post">
				<caption><h3 align="center">修改商城登录密码</h3></caption>
				<hr/>
				<div class="form-group">
					<label class="col-xs-3 control-label" for="oldpwd">旧密码:</label>
					<div class="col-xs-8">
						<input class="form-control" type="password" required pattern="^\w{6,12}$" name="oldPwd" placeholder="请输入6-12位密码,由数字,字母或下划线组成">
					</div>
				</div>
				<div class="form-group">
					<label class="col-xs-3 control-label" for="newpwd">新密码:</label>
					<div class="col-xs-8">
						<input class="form-control" type="password" required pattern="^\w{6,12}$" name="newPwd" placeholder="请输入6-12位密码,由数字,字母或下划线组成">
					</div>
				</div>
				<div class="form-group">
					<label class="col-xs-3 control-label" for="repwd">确认新密码:</label>
					<div class="col-xs-8">
						<input class="form-control" type="password" required pattern="^\w{6,12}$" name="rePwd" placeholder="请输入6-12位密码,由数字,字母或下划线组成">
					</div>
				</div>
				<div align="center">
					<label class="col-xs-3 control-label" for="repwd"> </label>
					<div class="col-xs-8">
						<button class="btn btn-primary  " style="padding:10px 161px">
							确认修改
						</button>
					</div>
				</div>
			</form>
			<div style="height:90px;"></div>
			<form onsubmit="return changePwd('highpwd')" class="form form-horizontal" id="highpwd" method="post">
				<caption><h3 align="center">修改商城二级密码</h3></caption>
				<hr/>
				<div class="form-group">
					<label class="col-xs-3 control-label" for="oldpwd">旧密码:</label>
					<div class="col-xs-8">
						<input class="form-control" type="password" required pattern="^\d{6}$" name="oldPwd" placeholder="请输入6位数字密码">
					</div>
				</div>
				<div class="form-group">
					<label class="col-xs-3 control-label" for="newpwd">新密码:</label>
					<div class="col-xs-8">
						<input class="form-control" type="password" required pattern="^\d{6}$" name="newPwd" placeholder="请输入6位数字密码">
					</div>
				</div>
				<div class="form-group">
					<label class="col-xs-3 control-label" for="repwd">确认新密码:</label>
					<div class="col-xs-8">
						<input class="form-control" type="password" required pattern="^\d{6}$" name="rePwd" placeholder="请输入6位数字密码">
					</div>
				</div>
				<div align="center">
					<label class="col-xs-3 control-label" for="repwd"> </label>
					<div class="col-xs-8">
						<button class="btn btn-primary  " style="padding:10px 161px">
							确认修改
						</button>
					</div>
				</div>
			</form>
		</div>
		
    </body>
	
	<script>
		function changePwd(pwdtype){
			var data=$("#"+pwdtype).serialize();
			console.log(data);
			var root='${pageContext.request.contextPath }';
			var url=root+'/modify_'+pwdtype+'.do'
			$.post(url,data,function(res){
				if(res.status=='null'){
					$('#infoText').text("不能为空!");
					$("#tip").modal('show');
					
				}else if(res.status=='error'){
					$('#infoText').text("修改失败,未知错误!");
					$("#tip").modal('show');
					
				}else if(res.status=='pwd'){
					$('#infoText').text("旧密码错误,请重试!");
					$("#tip").modal('show');
					
				}else if(res.status=='repwd'){
					$('#infoText').text("确认密码不一致");
					$("#tip").modal('show');
					
				}else if(res.status=='ok'){
					$('#infoText').html("修改成功!3秒后跳转至登录页面,您也可以手动点击<a href='"+root+"/login.jsp'>登录</a>");
					$("#tip").modal('show');
					setTimeout(function(){
						location.href=root+'/login.jsp';
					},3000);
					
				}else if(res.status=='nologin'){
					$('#infoText').html("抱歉,您需要<a href='"+root+"/login.jsp'>登录</a>");
					$("#tip").modal('show');
					setTimeout(function(){
						location.href=root+'/login.jsp';
					},3000);
				}
			});
			return false;
		}
		
	</script>
</html>